<%@ page language="java" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/pages/common/taglib.jsp"%>
<%@ include file="/WEB-INF/pages/common/back-common.jsp"%>
<%@ include file="/WEB-INF/pages/common/jquery2.1.4.jsp"%>
<%@ include file="/WEB-INF/pages/common/back-dialog.jsp"%>
<html>
<head>
<title>创建</title>
<script type='text/javascript' src="<ls:templateResource item='/resources/common/js/jquery.validate.js'/>" /></script>
<link rel="stylesheet" type="text/css" media="screen" href="${contextPath}/resources/common/css/errorform.css" />
<link href="<ls:templateResource item='/resources/plugins/select2-4.0/select2.css'/>" rel="stylesheet" />
<script src="<ls:templateResource item='/resources/plugins/select2-4.0/select2.full.min.js'/>" type="text/javascript"></script>
<script src="<ls:templateResource item='/resources/plugins/select2-4.0/i18n/zh-CN.js'/>" type="text/javascript"></script>
<script src="<ls:templateResource item='/resources/plugins/select2-4.0/makeSelect2.js'/>" type="text/javascript"></script>
<script src="<ls:templateResource item='/resources/plugins/My97DatePicker/WdatePicker.js'/>" type="text/javascript"></script>
<link rel="stylesheet" href="<ls:templateResource item='/resources/plugins/kindeditor/themes/default/default.css'/>"/>
<link rel="stylesheet" href="<ls:templateResource item='/resources/plugins/kindeditor/plugins/code/prettify.css'/>"/>
<script charset="utf-8" src="<ls:templateResource item='/resources/plugins/kindeditor/kindeditor-min.js'/>"></script>
<script charset="utf-8" src="<ls:templateResource item='/resources/plugins/kindeditor/lang/zh_CN.js'/>"></script>
<script charset="utf-8" src="<ls:templateResource item='/resources/plugins/kindeditor/plugins/code/prettify.js'/>"></script>
<script language="javascript">
	jQuery.validator.addMethod("fillContent", function(value, element) { 
		console.log(newsKindEditor.html());
	    return !newsKindEditor.isEmpty();       
	}, "必填"); 

	$(document).ready(function() {
		    	  var  contextPath = '${contextPath}';
		    jQuery("#form1").validate({
		            rules:  {
		            userName: {
		                required: true
		            },
		            work: {
		            	fillContent: true
		            },
		            startDate:"required",
		            endDate: "required"
		        },
		        messages: {
		        	userName: {
		                required: "必填"
		            },
		            work: {
		            	fillContent: "必填"
		            },
		            startDate: {
		                required: "必填"
		            },
		            endDate: {
		                required: "必填"
		            },
		        }
		    });
    
  	 //binding Submit
	 $("#Submit").click(function(){
	 if($("#form1").valid()){
		 newsKindEditor .sync();
	 var formData = $("#form1").serialize();
	   $.ajax({
       type: 'post', // 提交方式 get/post
       url:  "${contextPath}/admin/projectPlan/save", // 需要提交的 url
       data: formData,
       dataType : 'json', 
       error: function(jqXHR, textStatus, errorThrown) {
	 		 alert("保存失败" + textStatus);
		},
       success: function(data) { // data 保存提交后返回的数据，一般为 json 数据
           // 此处可对 data 作相关处理
           if("success" == data){
             layer.msg("保存成功");
             closeDialog();
           }else{
          		layer.msg("保存失败");
           }
         
       }
   });
   return false; // 阻止表单自动提交事件
	};
	});
    
 
		//斑马条纹
     	 $("#col1 tr:nth-child(even)").addClass("even");
     	makeMultiSelect2(contextPath + "/admin/adminUser/userListInTeam/${projectId}","#userName","项目成员","value","key");
     	
        KindEditor.options.filterMode = false;
        var newsKindEditor = KindEditor.create('textarea[name="work"]', {
            cssPath: '${contextPath}/resources/plugins/kindeditor/plugins/code/prettify.css',
            uploadJson: '${contextPath}/editor/uploadJson/upload;jsessionid=${cookie.JSESSIONID.value}',
            fileManagerJson: '${contextPath}/editor/uploadJson/fileManager',
            allowFileManager: true,
            width: '100%',
            height: '200px',
            items : [
   				'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold', 'italic', 'underline',
   				'removeformat', '|', 'justifyleft', 'justifycenter', 'justifyright', 'insertorderedlist',
   				'insertunorderedlist', '|', 'emoticons', 'link']
        });
        
        
    	$(".relateData").hover(function(){
    		var data=$(this).attr("data");
    		layer.tips(data, $(this), {
    			  tips: [1, '#3595CC'],
    			  time: 40000
    			});
    	},function(){
    		layer.closeAll('tips'); //关闭所有的tips层 
    	});
		
});
    
	function closeDialog(){
		var index = parent.layer.getFrameIndex("updateProjectPlan"); //先得到当前iframe层的索引
		parent.layer.close(index); //再执行关闭   
		if(parent.sendData){
			parent.sendData();//异步
		}else{
			parent.location.reload();
		}
	}
	
</script>
</head>
<body>
	<form action="<ls:url address='/admin/projectModule/save'/>" method="post" id="form1">
		<input id="id" name="id" value="${projectPlan.id}" type="hidden"> 
		<input id="projectId" name="projectId" value="${projectId}" type="hidden">
		<div align="center">
			<table border="0" align="center" class="${tableclass}" id="col1" style="width: 100%">
				<thead>
					<tr class="sortable">
						<th colspan="2">
							<div align="center">创建里程碑</div>
						</th>
					</tr>
				</thead>
				<tr>
					<td>
						<div align="center">
							负责人: <font color="ff0000">*</font>
						</div>
					</td>
					<td><select name="userName" id="userName" style="width: 300px">
							<c:if test="${not empty projectPlan.userName}">
								<option value="${projectPlan.userName}">${projectPlan.userRealName}</option>
							</c:if>
					</select>
					<c:if test="${not empty project.modules}">
	 					<select id="moduleId" name="moduleId">
	 					   <option value=""><font color="red">所属模块</font></option>
				      		<c:forEach items="${project.modules}" var = "module">
						        <option value="${module.id}" <c:if test="${module.id eq task.moduleId}">selected="selected"</c:if> >${module.name}</option>
						  	</c:forEach>
	 					</select>
					</c:if>
				  <select id="status" name="status">
					<ls:optionGroup type="select" required="true" defaultDisp="里程碑状态" cache="true" beanName="PROJECT_STATUS" selectedValue="${projectPlan.status}"/>
	              </select>  
					<select id="color" name="color">
							<ls:optionGroup type="select" required="false" cache="true" defaultDisp="标题颜色"
			                beanName="TASK_COLOR" selectedValue="${projectPlan.color}"/>
			        </select>
					</td>
				</tr>
				<tr>
					<td>标题<font color="ff0000">*</font></td>
					<td><input type="text" name="title" id="title" value="${projectPlan.title}" size="69" maxlength="200" style="height: 30px"></td>
				</tr>
				<tr>
					<td>里程碑 <font color="ff0000">*</font></td>
					<td><textarea name="work" id="work" cols="100" rows="8" style="width: 700px; height: 200px; visibility: hidden;">${projectPlan.work}</textarea></td>
				</tr>
				<tr>
					<td>
						<div align="center">里程碑时间 <font color="ff0000">*</font>:</div>
					</td>
					<td>
					       从: <input readonly="readonly" name="startDate" id="startDate" class="Wdate" type="text"
						onClick="WdatePicker({dateFmt:'yyyy-MM-dd',onpicked:function(){endDate.focus();},maxDate:'#F{$dp.$D(\'endDate\')}'})"
						value='<fmt:formatDate value="${projectPlan.startDate}" pattern="yyyy-MM-dd"/>' /> 
						
						到: <input readonly="readonly" name="endDate" id="endDate" class="Wdate" type="text"
						onClick="WdatePicker({dateFmt:'yyyy-MM-dd',minDate:'#F{$dp.$D(\'startDate\')}'})" value='<fmt:formatDate value="${projectPlan.endDate}" pattern="yyyy-MM-dd"/>' />

					</td>
				</tr>
				<tr>
					<td colspan="2">
						<div align="center">
							<input type="button" name="Submit" id="Submit" value="提交" /> <input type="button" value="关闭" onclick="javascript:closeDialog()" />
						</div>
					</td>
				</tr>
			</table>
		</div>
		<div style="clear: both;"></div>
			<div style="margin-left: 10px;float: left;margin-bottom: 10px">
		      		<c:forEach items="${requestScope.list}" var = "event">
				          <div class="group-item">
				         		 <span id="index-index" class="priv">${event.title} 
				         		 <c:if test="${not empty event.relateData}">
				         		     <span data="${event.relateData}" class="relateData">+</span>
				         		 </c:if>
				         		  </span>
				          </div>
				  	</c:forEach>
</div>
<br/>
	</form>
	

</body>
</html>

